<script setup lang="ts"></script>

<template>
  <div class="nav-notice-wrapper">
    <el-badge :is-dot="true">
      <div class="ring-ring-ring"></div>
    </el-badge>
  </div>
</template>

<style lang="scss" scoped>
.nav-notice-wrapper {
  width: auto;
  height: auto;
  cursor: pointer;
  :deep(.el-badge__content) {
    border: none;
  }
  :deep(.el-badge__content.is-fixed.is-dot) {
    top: 5px;
    right: 6px;
  }
  .ring-ring-ring {
    @include rect(20px, 24px);
    @include background-image('./imgs/bell.png', 100%, 100%);
  }
}
</style>
